<!--学员管理-->
<template>
    <div>
         <!-- 面包屑导航 -->
            <el-breadcrumb separator-class="el-icon-arrow-right">
            <el-breadcrumb-item :to="{ path: '/index' }">首页</el-breadcrumb-item>
            <el-breadcrumb-item>学员管理</el-breadcrumb-item>
            </el-breadcrumb>
             <div style="margin: 10px auto;"></div>

        <el-form :inline="true" :model="search" class="user-search">

             <el-form-item label="搜索：">
                <el-input clearable size="small" v-model="search.name" placeholder="用户名"></el-input>
            </el-form-item>
             <el-form-item >
                <el-input clearable size="small" v-model="search.tel" placeholder="电话"></el-input>
            </el-form-item>
            <el-form-item>
                <el-button size="small" type="primary" icon="el-icon-search" @click="findData()">搜索</el-button>
            </el-form-item>

            <el-form-item>
                <el-badge :value="nopassDate.length > 0 ? '新申请':'' " class="item">
                <el-button size="small" type="success"  @click=" Visible = true">新用户申请</el-button>
                </el-badge>
            </el-form-item>

            </el-form>
            <div style="margin: 10px auto;"></div>


            <!--列表-->
            
            <el-table size="small"  style="width: 100%" :data="listData" highlight-current-row v-loading="loading"  element-loading-text="拼命加载中" >
                
                <el-table-column
                    width="200"
                prop="username"
                label="姓名">
                </el-table-column>

                <el-table-column
                    width="200"
                prop=""
                label="头像">
                <template slot-scope="scope">
                        <el-avatar :size="50" :src="scope.row.url"></el-avatar>
                </template>
                </el-table-column>

                <el-table-column
                    width="200"
                prop="tel"
                label="电话">
                </el-table-column>
               
               <el-table-column
                    width="200"
                prop="idCard"
                label="身份证号">
                </el-table-column>

                <el-table-column
                    width="200"
                prop="state"
                label="是否可用">
                     <template slot-scope="scope">
                        <el-tag :type="scope.row.state == '0'?'success':'danger'">{{scope.row.state == '0'?'可用':'不可用'}}</el-tag>
                </template>
                </el-table-column>

                <el-table-column
                    width="100"
                prop="testStatus"
                label="科目状态">
                </el-table-column>
               
               <el-table-column align="center" label="操作" >
                    <template slot-scope="scope">
                    <el-button type="danger" size="mini" icon="el-icon-edit" @click="handleEdit(scope.row)">编辑</el-button>
                    </template>
                </el-table-column>
                


           
           
            </el-table>

            <!--没通过-->
            <el-dialog title="用户申请" :visible.sync="Visible" width="50%" >
                     <el-table size="small"  style="width: 100%" :data="nopassDate" highlight-current-row   element-loading-text="拼命加载中" >
                
                <el-table-column
                    width="200"
                prop="username"
                label="姓名">
                </el-table-column>

                <el-table-column
                    width="200"
                prop=""
                label="头像">
                <template slot-scope="scope">
                        <el-avatar :size="50" :src="scope.row.url"></el-avatar>
                </template>
                </el-table-column>

                <el-table-column
                    width="200"
                prop="tel"
                label="电话">
                </el-table-column>
               
               <el-table-column
                    width="200"
                prop="idCard"
                label="身份证号">
                </el-table-column>

                

                
               
               <el-table-column align="center" label="操作" >
                    <template slot-scope="scope">
                    <el-button type="danger" size="mini"  @click="pass(scope.row.id)">通过</el-button>
                    </template>
                </el-table-column>
                


           
           
            </el-table>
            </el-dialog>

             <!--没通过-->
            <el-dialog title="用户编辑" :visible.sync="Visible1" width="40%" >
                   <el-form label-width="120px" :model="editForm" >
                        <el-form-item label="用户名" >
                        <el-input style="width:300px" size="small" v-model="editForm.username" auto-complete="off" placeholder="请输入部门名称"></el-input>
                        </el-form-item>
                        <el-form-item label="身份证号" >
                        <el-input style="width:300px" size="small" v-model="editForm.idCard" auto-complete="off" placeholder="请输入部门代码"></el-input>
                        </el-form-item>
                         <el-form-item label="权限">
                            <el-radio v-model="editForm.state" label="0">可用</el-radio>
                            <el-radio v-model="editForm.state" label="2">禁用</el-radio>
                        
                        </el-form-item>
                        <el-form-item>
                            <el-button type="primary" @click="save()">保存</el-button>
                        </el-form-item>
                    </el-form> 
            </el-dialog>


 <!-- 分页组件 -->
    <Pagination v-bind:child-msg="pageparm" @callFather="callFather"></Pagination>

    </div>
</template>
<script>
import Pagination from '../../components/Pagination'
export default {
    components: {
        Pagination
    },
    data() {
        return {
            editForm:{
                 username:"",
                 idCard:"",
                 state:"",
                 id:""
            },
            Visible1:false,
            Visible:false,
            listData:[],
            search:{
                name:"",
                tel:"",
                page:1,
                limit:10,
                rid:'2'

            },
            nopassDate:[],
            loading:false,
            // 分页参数
            pageparm: {
                currentPage: 1,
                pageSize: 10,
                total: 10
            }
        }
    },
    created(){
             this.findData();
             
    },
    methods: {
        handleEdit(data){ //编辑
           this.Visible1=true;
            this.editForm.username = data.username;
            this.editForm.idCard =data.idCard;
            this.editForm.state =data.state
            this.editForm.id=data.id;

        },
        save(){ //保存
             this.$api.post("/user/token/updateUserByid",this.editForm,res=>{
                    this.Visible1 =false
                    this.findData();
            })
        },
        pass(id){ //申请通过
            this.$api.get("/user/token/findUserPassByAdmin",{"id":id},res=>{
                    this.Visible =false
                    this.findData();
            })
        },
        findData(){
            this.MyLoading();
            this.$api.post("/user/token/findUserByAdmin",this.search,res=>{
                    this.pageparm.total =res.data.total;
                    this.listData = res.data.data;
                    this.nopassDate =res.data.datamap.nopass;
            })
        },
        callFather(parm) {
            this.search.page = parm.currentPage
            this.search.limit = parm.pageSize
            this.findData();
        },
         MyLoading(){
            this.loading =true;
            setTimeout(()=>{
                this.loading =false
            },500)
        },
        
    },
}
</script>
<style scoped>

</style>